<app-header></app-header>
<!-- 主页正文部分 Start -->
<!--轮播S-->
<app-banner></app-banner>
<!--轮播E-->
<!--内容开始-->
<div style="background-color: #efeef2; width:100%; position: relative;">
<div class="container">
    <div class="row">
        <div class="hidden-sm hidden-xs col-md-12 col-lg-12 top_box_01">
            <!--开始-->
            <div class="hidden-sm hidden-xs col-md-12 col-lg-12 top_box_02">
                <div class="industry col-sm-12 col-lg-12 ">
                    <ul class="col-md-1 col-lg-1">
                        <li class="home-classification home-fenlei"><b>分类：</b></li>
                    </ul>
                    <ul class="col-md-11 col-lg-11 home-fenlei-ul">
                        <li *ngFor="let category of category.list" [class.active]="category.id === selectedCategory">
                            <a (click)="seleteCategory(category.id)" class="home-a">
                                <span class="name" >{{category.name}}</span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
            <!--结束-->
        </div>
    </div>
    <!--节假结束-->

    <!--列表页开始-->
    <div class="row hidden-sm hidden-xs minH">
        <div class="col-md-12 col-lg-12 game_box">
            <div *ngFor="let gameList of games.list" class="col-sm-3 col-md-3 col-lg-3 col-xs-3 game_box_01">
                <div class="home-list">
                <div class="lib_game_box">
                    <div class="lib_game">
                        <a href="/game_details/{{gameList.id}}"><img src="{{resource_url}}{{gameList.resource}}{{gameList.thumb}}" alt=""></a>
                    </div>
                    <div class="gamw_wz_01">
                        <a href="/game_view/{{gameList.id}}">预览</a>
                    </div>
                </div>
                <div class="game_bos">
                    <div class="game_bot_01">
                        <b>{{gameList.name}}</b>
                        <div></div>
                    </div>
                    <ul class="top_game_01">
                        <li>{{gameList.catagory_name}}</li>
                        <li> 单价</li>
                        <li class="danjia_01"> <span>￥</span>{{gameList.price}}</li>
                    </ul>
                    <div class="box_sht_01">
                        <div class="img_xin">
                            <div class="img_xin_01">
                                <img src="../../assets/image/home/shiyong_03.png" alt="">
                            </div>
                            <ul>
                                <li class="yishi_y">已使用</li>
                                <li *ngIf="gameList.amount == null">0</li>
                                <li *ngIf="gameList.amount > 0">{{gameList.amount}}</li>
                            </ul>
                        </div>
                        <div class="img_xin_10">
                            <div class="img_xin_01">
                                <img src="../../assets/image/home/cooke_03.png" alt="">
                            </div>
                            <ul>
                                <li class="yishi_y">时间</li>
                              <!--  <li class="timers">{{time}}</li>-->
                                <li class="timers">{{gameList.create_time}}</li>
                                <!--<li>{{gameList.create_time| date:'yyyy.MM.dd'}}</li>-->
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="btn_box">
                    <a (click)="buyGame(gameList.id,gameList.price)">立即购买</a>
                </div>
            </div>
            </div>
            <div style="clear: both;"></div>
        </div>
    </div>
    <!--列表页结束-->

    <!--遮罩开始-->
    <div class="mask1" [class.hide]="isPayGame">
        <ul class="mask1_copy">
            <li>
                <h3 class="weixin"><b>购买游戏</b></h3>
            </li>
            <li class="quere_fukuan_01">
                <h4>确认去付款</h4>
            </li>
            <li class="quere_fukuan_02">
                <p>(<b>价格{{price}}，当前余额{{money}}元</b>)</p>
            </li>
            <li class="estab_lished">
                <a (click)="noBuyGame()" class="established">取消</a>
            </li>
            <li class="away_qux">
                <a (click)="payGame()" class="away">去购买</a>
            </li>
        </ul>
    </div>
    <!--遮罩结束-->

    <!--手机端开始-->
    <div class="row">
        <div class="phone_box col-sm-12 col-xs-12 hidden-md hidden-lg">
            <div class="phone_box_01 col-sm-1 col-xs-2">分类</div>
            <div class="nav-film col-sm-10 col-xs-8">
                <ul class="tag_ul">
                    <li *ngFor="let category of category.list" (click)="seleteCategory(category.id)" [class.active]="category.id === selectedCategory">
                        <a>{{category.name}}</a>
                    </li>
                </ul>
            </div>
            <div id="more" class="phone_box_01 col-sm-1 col-xs-2 nav-film" (click)="tagShow()">
                更多
            </div>
        </div>
        <div class="row">
            <div class="phone_box_lb col-sm-12 col-xs-12 hidden-md hidden-lg">
                <div *ngFor="let gameList of games.list" class="phone_box_02 col-sm-6 col-xs-6 hidden-md hidden-lg">
                    <div class="phone_leib_01">
                        <a href="/game_details/{{gameList.id}}"><img src="{{resource_url}}{{gameList.resource}}{{gameList.thumb}}" alt=""></a>
                    </div>
                    <div class="phone_wenb">
                        <div class="phone_wenb_01">{{gameList.name}}</div>
                        <div class="phone_wenb_02">{{gameList.description}}</div>
                        <div class="gouma_01">
                            <div class="gouma_01_01">
                                <a>RMB{{gameList.price}}</a>
                            </div>
                            <div class="gouma_01_01_line"> </div>
                            <div class="gouma_01_02">
                                <a (click)="buyGame(gameList.id,gameList.price)">立即购买</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--分页开始-->

    <div class="addMore" id="addMore">
        <img src="../../assets/image/commom/loadingone.gif" />加载更多...
    </div>
    <div class="top" (click)="pageScroll()">
        <img src="../../assets/image/commom/top.png" />
    </div>
</div>
</div>
<!-- 主页正文部分 End -->
    <div style="clear: both;"></div>
<app-footer></app-footer>